<?php include 'init.php';?>
<?php 	
	$jbanner = get_config('banner');
	$banner = json_decode($jbanner,true);
	$cates = getCateByPid(0);
	//判断是否第一次打开本页面分页
	if (isset($_GET['page'])&&$_GET['page']>0) {
		$page=$_GET['page'];
	}else{
		$page=1;
	}



	//查找数据库
	$sql = "SELECT count(*) FROM article";
	if (isset($_GET['cid'])&&$_GET['cid']>0) {
		$sql .= " LEFT JOIN article_to_category on article.id=article_to_category.article_id WHERE category_id={$_GET['cid']}";
	}
	$count = $mysql->getOne($sql);
	$limit = 4;
	$p = new MyPage($count,$limit,$page);
	$pageHtml = $p->render();



	//通过分类查看文章的数据数据
	$sql = "SELECT article.* FROM article ";
	if (isset($_GET['cid'])&&$_GET['cid']>0) {
		$sql .= " LEFT JOIN article_to_category on article.id=article_to_category.article_id WHERE category_id={$_GET['cid']}";
	}
	$start = ($page-1)*$limit;
	$sql .= " limit {$start},{$limit}";
	$result = $mysql -> getAll($sql); 


	//文章搜索
	//文章页面进行搜索
	if (!empty($_GET['find'])&&!empty($_GET['seek'])) {
		$sql = "SELECT count(*) FROM article WHERE title LIKE '%{$_GET['seek']}%' or author LIKE '%{$_GET['seek']}%'";
		$count = $mysql->getOne($sql);
		$limit = 5;
		$p = new MyPage($count,$limit,$page);
		$pageHtml = $p->render();//搜索后的分页按钮

		// $seek=$_GET['seek'];
		$sql = "SELECT article.* FROM article WHERE title LIKE '%{$_GET['seek']}%' or author LIKE '%{$_GET['seek']}%'";
		$start = ($page-1)*$limit;
		$sql .= " limit {$start},{$limit}";
		$find=$mysql->getAll($sql);//搜索后的数据
	}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title><?php echo get_config('title');?></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- Custom Theme files -->
<link href="public/css/bootstrap.css" type="text/css" rel="stylesheet" media="all">
<link href="public/css/style.css" type="text/css" rel="stylesheet" media="all">  
<!-- //Custom Theme files -->
<!-- font-awesome icons -->
<link href="public/css/font-awesome.css" rel="stylesheet"> 
<!-- //font-awesome icons -->
<!-- js -->
<script src="public/js/jquery-2.2.3.min.js"></script> 
<!-- //js -->
<!-- web-fonts --> 
<!-- <link href="//fonts.googleapis.com/css?family=Aladin" rel="stylesheet"> -->
<!-- <link href='//fonts.googleapis.com/css?family=Roboto+Condensed:400,300,300italic,400italic,700,700italic' rel='stylesheet' type='text/css'> -->
<!-- //web-fonts --> 
<!-- start-smooth-scrolling -->
<link rel="stylesheet" type="text/css" href="public/bootsrap/css/bootstrap.min.css">
<script type="text/javascript" src="public/js/move-top.js"></script>
<script type="text/javascript" src="public/js/easing.js"></script>	

<script type="text/javascript">
		jQuery(document).ready(function($) {
			$(".scroll").click(function(event){		
				event.preventDefault();
				$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
			});
		});
</script>
<!-- //end-smooth-scrolling -->
</head>
<body>
	<!-- banner start here -->
	<div class="agileinfo-main about-top">
		<div class="slider">
			<script src="public/js/responsiveslides.min.js"></script>
			<script>
				// You can also use "$(window).load(function() {"
				$(function () {
				  // Slideshow 1
				  $("#slider1").responsiveSlides({
					 auto: true,
					 nav: true,
					 speed: 500,
					 namespace: "callbacks",
				  });
				});
			</script>
			<ul class="rslides" id="slider1" style="height: 300px;">
				<li>
					<div class="banner" style="background: url('public/upload/<?php echo $banner[0]['banner'];?>')no-repeat center;">
						<h3>把醉了的明天寄托在潘多拉的琴弦、浮沉余生虚伪地歌咏天上人间。 </h3>
					</div>
				</li>
				<li>
					<div class="banner banner2" style="background: url('public/upload/<?php echo $banner[1]['banner'];?>')no-repeat center;">
						<h3>话说天下大势，分久必和，合久必分。 </h3>
					</div>
				</li>
				<li>
					<div class="banner banner3" style="background: url('public/upload/<?php echo $banner[2]['banner'];?>')no-repeat center 0px;">
						<h3>相思只在梦魂中。今宵月，偏照小楼东。 </h3>
					</div>
				</li>
			</ul>
		</div>  
		<div class="agileinfo-header">
			<div class="container">
				<div class="agile-logo">
					<h1><a href="index.html"><i class="fa bounce bounceIn animated" aria-hidden="true"><img src="public/upload/<?php echo get_config('sitelogo');?>" style="width: 60px;height: 60px;"><br></i> <a style="font-size: 30px;font-weight: bolder;color: #fff;">风散了墨香</a>
					<!-- Rock -->
					</a></h1>
				</div>
				<div class="agileits-w3layouts-icons">
					<div class="social-icon">
						<!-- <a href="#" class="social-button qq" title=""QQ登录><i class="fa fa-qq">QQ</i></a>
						<a href="#" class="social-button weibo"><i class="fa fa-weibo" ></i></a> 
						<a href="#" class="social-button weixin"><i class="fa fa-comments" aria-hidden="true"></i></a> -->
						<!-- <a href="#" class="social-button register"><i class="fa ">注册</i></a> -->
						<a href="admin/login.php" class="social-button sign-in" title="管理员登录" alt="管理员登录"><i class="fa fa-user fa-fw"></i></a>
					</div> 
				</div>
				<div class="clearfix"> </div>
			</div>	    
		</div>
		<!-- navigation start here -->
		<div class="top-nav">
			<span class="menu">Menu</span>	
			<ul class="w3l">
				<li><a href="index.php"><i aria-hidden="true" class="glyphicon glyphicon-home"></i><span>主页</span></a></li>
				<li><a href="blog.php"><i class="glyphicon glyphicon-list-alt"></i><span>博文排列</span></a></li>
				<li><a class="active" href="codes.php"><i class="glyphicon glyphicon-picture"></i><span>博图排列</span></a></li>
				<li id="about_nav"><a href="about.php"><i class="glyphicon glyphicon-user"></i><span>关于</span></a></li>
				<li><a href="contact.php"><i class="glyphicon glyphicon-envelope"></i><span>联系</span></a></li>
			</ul>
			<!-- script-for-menu -->
			<script>
			   $( "span.menu" ).click(function() {
				 $( "ul.w3l" ).slideToggle( 300, function() {
				 // Animation complete.
				  });
				 });
			</script>
			<!-- //script-for-menu -->
		</div>	
	</div>
	<!-- //navigation end here -->
	<!-- 博客分类导航条 -->
	<div class="category nav nav-primary" id="nav_cate">
		<div class="container-fluid category_fluid">
		    <!-- Collect the nav links, forms, and other content for toggling -->
		    <!-- <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> -->
		    <div class="left_nav"></div>
		      <ul class="nav navbar-nav first_nav" id="nav">
		      	<?php foreach($cates as $cate){?>
		      		<li id="second_nav"><a href="blog.php?cid=<?php echo $cate['id']?>"><?php echo $cate['name']?></a>
		      			<?php if(!empty($cate['child'])){?>
		      				<ul class="nav navbar-nav dropdown-menu " id="third_nav">
		      					<?php foreach ($cate['child'] as $child) {?>
		      						<li id="third_content"><a href="blog.php?cid=<?php echo $child['id']?>"><?php echo $child['name']?></a>
		      							<?php if(!empty($child['child'])){?>
		      								<ul class="dropdown-menu " id="four_nav">
		      									<?php foreach ($child['child'] as $childson) {?>
		      										<li><a href="blog.php?cid=<?php echo $childson['id']?>"><?php echo $childson['name']?></a>
		      									<?php }?>
		      								</ul>
		      							<?php } ?>
		      					<?php } ?>
		      				</ul>
		      			<?php } ?>
		      		</li>
		      	<?php }?>
		      </ul>
		    <!-- </div>/.navbar-collapse -->
		  </div><!-- /.container-fluid -->
	</div>
	<!-- 博客分类导航条 -->
	<div id="middle_block">&nbsp;</div>
	<?php include 'view_new_rand.php'; ?>
	<div id="middle_block">&nbsp;</div>
	<div>&nbsp;</div>
	<!-- 搜索框 -->
	<form action="codes.php" method="get">
		<div class="seach_all" id="search_fade">
			<div class="search_left">&nbsp;</div>
		    <div class="seach_border">
		    	<div class="search_left">
		    		<i class="fa fa-search fa-2x" aria-hidden="true" class="search_logo"></i>
		    	</div>
		    	<input type="text" name="seek" class="search_content" placeholder="搜索博客文章……">
		    </div>
		    <button class="btn search_right"  name="find" value="1"><span>博文搜索</span></button>
		</div>
	</form>
	<!-- 搜索框 -->
	<!-- 导航和搜索框导入导出 -->
	<script type="text/javascript">
		$(window).on('scroll',function(){
		    if ($(window).scrollTop()>=330) {
		    	$('#nav_cate').addClass('fadeIn_Out');
		    	// $('#search_fade').addClass('fadeInOut_seach');
		    }else{
		    	$('#nav_cate').removeClass('fadeIn_Out');
		    	// $('#search_fade').removeClass('fadeInOut_seach');
		    }
		    
		});
	</script>
	<!-- short-codes --> 
	<div class="codes">
		<div class="container">
			<h3 class="agile-title">图文概略</h3>    
			<div class="wthree-grid">
				<?php if (isset($_GET['find'])) { ?>
			  			<?php if (empty($find)) { $find[]=array("Sorry!..(｡•ˇ‸ˇ•｡)…没找到您需要的文章。"); ?>
				  			<table class="table">		
								<thead>
										<?php foreach ($find as $key => $value) { ?>
											<?php foreach ($value as $k => $v) { ?>
												<tr><td colspan="5" style="font-size: 30px;text-align: center;height: 200px;line-height: 200px;color:gray;"><?php echo $v; ?></td></tr>
										<?php }} ?>
								</thead>
								<script type="text/javascript">
									$(function(){
										$('#page_btn').hide();
									});
								</script>
							</table>
						<?php	}else{  ?>
								<?php foreach ($find as $key => $value) { ?>
									<div class="col-md-6 w3lsalbums-grid">
										<div class="albums-w3top">
											<h5><?php echo $value['title']; ?></h5>
										</div>
										<div class="albums-left"> 
											<!-- <a href="single.html" class="wthree-almub">  
											</a> -->
											<a href="single.php?art_id=<?php echo $value['id'];?>">
												<img src="public/upload/<?php echo $value['img']?>" style="width:269px;height: 195px;">
											</a>
											
										</div>
										<div class="albums-right">
											<h4><a  class="part_content" href="single.php?art_id=<?php echo $value['id'];?>"  style="font-size: 7px;"><?php echo mb_substr(strip_tags(htmlspecialchars_decode($value['content'])),0,18)."……"; ?></a></h4>
											<p><?php echo date("Y年m月d日",$value['add_time']); ?></p>
											<a class="w3more" href="single.html"><i class="fa fa-mail-forward" aria-hidden="true"></i> More</a>
										</div>
										<div class="clearfix"></div>
									</div>
								<?php } ?>
						<?php } ?>
				<?php	}else{  ?>
					<?php foreach ($result as $key => $value) { ?>
						<div class="col-md-6 w3lsalbums-grid">
							<div class="albums-w3top">
								<h5><?php echo $value['title']; ?></h5>
							</div>
							<div class="albums-left"> 
								<!-- <a href="single.html" class="wthree-almub">  
								</a> -->
								<a href="single.php?art_id=<?php echo $value['id'];?>">
									<img src="public/upload/<?php echo $value['img']?>" style="width:269px;height: 195px;">
								</a>
								
							</div>
							<div class="albums-right">
								<h4><a class="part_content" href="single.php?art_id=<?php echo $value['id'];?>" style="font-size: 7px;"><?php echo mb_substr(strip_tags(htmlspecialchars_decode($value['content'])),0,18)."……"; ?></a></h4>
								<p><?php echo date("Y年m月d日",$value['add_time']); ?></p>
								<a class="w3more" href="single.php?art_id=<?php echo $value['id'];?>"><i class="fa fa-mail-forward" aria-hidden="true"></i> More</a>
							</div>
							<div class="clearfix"></div>
						</div>
					<?php } ?>
				<?php } ?>	
				
				<!-- <div class="grid_3 grid_5 w3-agileits">
					<h3 class="w3ls-hdg">Alerts</h3>
					
					<div class="alert alert-danger" role="alert">
						<strong>Oh snap!</strong> Change a few things up and try submitting again.
					</div>
				</div> -->
			</div>
		</div>	
	</div>  
	<!-- //short-codes -->  
	<div class="pagelist">
		<nav>
			<div class="pagebutton" id="page_btn"><?php echo $pageHtml; ?></div>
		</nav>
	</div>
	
	<!-- //footer end here -->
	<?php include "footer.php"; ?>
	<!-- 下拉菜单效果 -->
    <script src="public/js/bootstrap.js"></script>
    <script type="text/javascript">
		$('#nav > li').on('mouseover',function(){
			$(this).find('#third_nav').show();
			$(this).css('background','#007b70');
			$(this).find('#third_nav').css('background','#ff4c4c');
		});
		
		$('#nav > li').on('mouseout',function(){
			$(this).css('background','#ff4c4c');
			$(this).find('#third_nav').hide();
		});

		$('#third_nav > li').on('mouseover',function(){
			$(this).find('#four_nav').show();
			$(this).css('background','#ff4c4c');
			$(this).css('width','100%');
			$(this).find('#four_nav').css('background','#ff4c4c');
		});
		$('#third_nav > li').on('mouseout',function(){
			$(this).find('#four_nav').hide();
			$(this).css('background','#ff4c4c');
		});

		$('#four_nav > li').on('mouseover',function(){
			// $(this).parent().css('background','#007b70');
			$(this).css('background','#ff4c4c');
			$(this).css('position','absoulte');
		});
		$('#four_nav > li').on('mouseout',function(){
			// $(this).find('#four_nav').hide();
			$(this).css('background','#ff4c4c');
		});
	</script>
</body>
</html>